<style type="text/css">
    .m-service-info {
        padding: 30px;
    }
    .m-service-info li{
        height:30px;
        line-height:30px;
    }
    .m-service-info span{
        display: inline-block;
    }
    .m-service-info span.service-type{
        width:100px;
    }
    .m-service-info span.service-detail{
        margin:0px 10px;
    }
</style>
<div class="m-service-info">
    <ul>
        <li ng-repeat="item in serviceInfoList">
            <span>{{$index+1}}.</span>
            <span class="service-type">
                {{item.serviceTypeName}}({{item.servicePropertyName}})
            </span>
            <span>：</span>
            <span class="service-detail">
                {{item.serviceName}}({{item.serviceCode}})
            </span>
            <span class="service-supplier">
                {{item.supplierName}}({{item.supplierCode}})
            </span>
        </li>
    </ul>
</div>